body {
	display: flex;
	flex-direction: column;
	overflow: auto;

	&::-webkit-scrollbar {
		/*滚动条整体样式*/
		width: 8px;
		/*高宽分别对应横竖滚动条的尺寸*/
		height: 1px;
	}
}

.area {
	width: 100%;
	height: 610px;
	overflow: auto;
}
header {
	padding: 5%;
}
// 中心内容
main {
	width: 100%;
	background-color: #ccc;
	transform: translateY(35px);
}

.area {
	width: 100%;
	height: 610px;
	overflow: auto;
}

header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 40px;
	position: fixed;
	background-color: #fff;
	z-index: 20;

	#add {
		* {
			font-family: cursive;
		}

		.container {
			width: 1200px;
			margin: 0 auto;
		}

		body {
			display: flex;
			flex-direction: column;
			overflow: auto;
		}

		header {
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 100%;
			height: 40px;

			#add {
				width: 70px;
				height: 35px;
				color: #d5cccc;
				background: #4b8de3;
				border-radius: 30px;
			}
		}

		.navList {
			display: flex;
			text-align: center;
			justify-content: space-evenly;
			width: 72%;
			height: 40px;
			border-bottom: solid 1px #ccc;

			li {
				height: 40px;
				padding: 0 10px;
				box-sizing: border-box;
				line-height: 40px;
				font-size: 16px;
			}

			li.active {
				color: #4294ff;
				border-bottom: solid 2px#4294ff;
			}
		}

		.userDynamic {
			display: flex;
			flex-direction: column;
			align-items: center;
			width: 100%;
			margin-bottom: 20px;
			background-color: #fff;

			li {
				display: flex;
				flex-direction: column;
				justify-content: center;
				margin: 10px 0;
				width: 100%;
				padding: 0 10px;
				box-sizing: border-box;

				.seem {
					width: 60px;
					height: 60px;
					border-radius: 50%;
					// background: url(../../assets/imgs/binghuo.jpg) center no-repeat;
					background-size: cover;
					position: relative;
				}
			}
		}

		.userAddress {
			position: absolute;
			right: -85px;
			top: 10px;

			span:first-child {
				font-size: 20px;
			}

			span:last-child {
				color: #999;
			}
		}

		.plus {
			position: relative;
			text-align: center;
			left: 280px;
			width: 80px;
			height: 60px;
			line-height: 60px;
			font-size: 22px;
			color: #999;
		}

		.plus.ac {
			position: relative;
			text-align: center;
			left: 280px;
			width: 80px;
			height: 60px;
			line-height: 60px;
			font-size: 22px;
			color: #1870be;
		}

		.textArea {
			margin: 10px 0;
		}

		.imgList {
			width: 100%;
			height: 250px;
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;

			li {
				width: 100px;
				height: 100px;
			}
		}

		.good {
			display: flex;
			justify-content: space-between;
		}

		.likeArea {
			width: 150px;
			height: 25px;

			.praise {
				position: relative;
				display: inline-block;
				width: 70px;
				height: 25px;

				.praiseIcon {
					display: inline-block;
					width: 25px;
					height: 25px;
					// background: url(../../assets/imgs/点赞.png) center;
					background-size: cover;

					&::before {
						content: "9999";
						position: absolute;
						right: 5px;
						line-height: 25px;
					}
				}
			}

			.discuss {
				position: relative;
				display: inline-block;
				width: 70px;
				height: 25px;

				.discussIcon {
					display: inline-block;
					width: 25px;
					height: 25px;
					// background: url(../../assets/imgs/评论.png) center;
					background-size: cover;

					&::before {
						content: "9999";
						position: absolute;
						right: 5px;
						line-height: 25px;
					}
				}
			}
		}

		.cutNav {
			display: flex;
			position: fixed;
			justify-content: space-around;
			bottom: -1px;
			width: 100%;
			height: 80px;
			box-shadow: -7px 6px 20px 5px #000;
			background-color: #ffffff;

			li {
				display: flex;
				flex-direction: column;
				align-items: center;
				height: 80px;
			}

			.iconfont {
				font-size: 50px;
			}

			li.active {
				color: #4294ff;
			}
		}

		width: 70px;
		height: 35px;
		color: #d5cccc;
		background: #4b8de3;
		border-radius: 30px;
	}
}

.navList {
	display: flex;
	text-align: center;
	justify-content: space-evenly;
	width: 72%;
	height: 40px;
	border-bottom: solid 1px #ccc;

	li {
		height: 40px;
		padding: 0 10px;
		box-sizing: border-box;
		line-height: 40px;
		font-size: 16px;
	}

	li.active {
		color: #4294ff;
		border-bottom: solid 2px#4294ff;
	}
}

// 中心内容
main {
	width: 100%;
	height: 1000px;
	background-color: #ccc;
}

.userDynamic {
	display: flex;
	flex-direction: column;
	align-items: center;
	width: 100%;
	margin-bottom: 20px;
	background-color: #fff;

	li {
		display: flex;
		flex-direction: column;
		justify-content: center;
		margin: 10px 0;
		width: 100%;
		padding: 0 10px;
		box-sizing: border-box;

		.seem {
			width: 60px;
			height: 60px;
			border-radius: 50%;
			// background: url(../../assets/imgs/binghuo.jpg) center no-repeat;
			background-size: cover;
			position: relative;
		}
	}
}

.userAddress {
	position: absolute;
	right: -85px;
	top: 10px;

	span:first-child {
		font-size: 20px;
	}

	span:last-child {
		color: #999;
	}
}

.plus {
	position: relative;
	text-align: center;
	left: 280px;
	width: 80px;
	height: 60px;
	line-height: 60px;
	font-size: 22px;
	color: #999;
}

.plus.ac {
	position: relative;
	text-align: center;
	left: 280px;
	width: 80px;
	height: 60px;
	line-height: 60px;
	font-size: 22px;
	color: #1870be;
}

.textArea {
	margin: 10px 0;
}

.imgList {
	width: 100%;
	height: 250px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;

	li {
		width: 100px;
		height: 100px;
	}
}

.good {
	display: flex;
	justify-content: space-between;
}

.likeArea {
	width: 150px;
	height: 25px;

	.praise {
		position: relative;
		display: inline-block;
		width: 70px;
		height: 25px;

		.praiseIcon {
			display: inline-block;
			width: 25px;
			height: 25px;
			// background: url(../../assets/imgs/点赞.png) center;
			background-size: cover;

			&::before {
				content: "9999";
				position: absolute;
				right: 5px;
				line-height: 25px;
			}
		}
	}

	.discuss {
		position: relative;
		display: inline-block;
		width: 70px;
		height: 25px;

		.discussIcon {
			display: inline-block;
			width: 25px;
			height: 25px;
			// background: url(../../assets/imgs/评论.png) center;
			background-size: cover;

			&::before {
				content: "9999";
				position: absolute;
				right: 5px;
				line-height: 25px;
			}
		}
	}
}
